<template>
  <VCard>
    <VToolbar color="primary" dark>
      <VToolbarTitle>咨询预约审核</VToolbarTitle>
    </VToolbar>
    <VCardText>
      <VDataTable :headers="headers" :items="records" :loading="loading">
        <template #item.risk_level="{ item }">
          <VChip :color="getRiskLevelColor(item.risk_level)" size="small">
            {{ getRiskLevelText(item.risk_level) }}
          </VChip>
        </template>
        <template #item.note="{ item }">
          <VBtn size="small" variant="text" @click="showNote(item.note)">查看</VBtn>
        </template>
        <template #item.action="{ item }">
          <VBtn color="primary" size="small" @click="openDialog(item)">审核</VBtn>
        </template>
      </VDataTable>
    </VCardText>
  </VCard>

  <!-- 审核弹窗 -->
  <VDialog v-model="dialog" max-width="400px" @keydown.esc="dialog = false" @click:outside="dialog = false">
    <VCard>
      <VCardTitle>咨询预约审核</VCardTitle>
      <VCardText>
        <div class="d-flex justify-center">
          <VBtn color="success" class="mr-4" @click="handleApprove">通过</VBtn>
          <VBtn color="error" @click="handleReject">打回</VBtn>
        </div>
      </VCardText>
    </VCard>
  </VDialog>

  <!-- 笔记弹窗 -->
  <VDialog v-model="noteDialog" max-width="500px" @keydown.esc="noteDialog = false" @click:outside="noteDialog = false">
    <VCard>
      <VCardTitle>完整笔记</VCardTitle>
      <VCardText>
        <pre style="white-space: pre-wrap;">{{ noteContent }}</pre>
      </VCardText>
      <VCardActions>
        <VSpacer />
        <VBtn color="primary" @click="noteDialog = false">关闭</VBtn>
      </VCardActions>
    </VCard>
  </VDialog>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { getInitialVisitRecords } from '@/api/initialVisitor';
import { approveVisitRecord, rejectVisitRecord } from '@/api/assistant';
import { useSnackbarStore } from '@/store/snackbarStore';

const snackbarStore = useSnackbarStore();
const loading = ref(false);
const records = ref<any[]>([]);
const dialog = ref(false);
const selected = ref<any>(null);

const noteDialog = ref(false);
const noteContent = ref('');
function showNote(note: string) {
  noteContent.value = note;
  noteDialog.value = true;
}

const headers = [
  { title: '预约ID', key: 'appointment_id' },
  { title: '危机等级', key: 'risk_level' },
  { title: '问题类型', key: 'problem_type' },
  { title: '初访结论', key: 'conclusion' },
  { title: '笔记', key: 'note' },
  { title: '操作', key: 'action', sortable: false }
];

const getRiskLevelText = (riskLevel: string) => {
  const riskMap: Record<string, string> = {
    'LOW': '低',
    'MEDIUM': '中',
    'HIGH': '高',
    'CRITICAL': '严重'
  };
  return riskMap[riskLevel] || riskLevel;
};

const getRiskLevelColor = (riskLevel: string) => {
  const colorMap: Record<string, string> = {
    'LOW': 'success',
    'MEDIUM': 'warning',
    'HIGH': 'error',
    'CRITICAL': 'error'
  };
  return colorMap[riskLevel] || 'default';
};

function openDialog(item: any) {
  selected.value = item;
  dialog.value = true;
}

async function loadData() {
  loading.value = true;
  try {
    const res = await getInitialVisitRecords();
    if (res.data && res.data.code === 200) {
      records.value = res.data.data;
    }
  } finally {
    loading.value = false;
  }
}

async function handleApprove() {
  if (!selected.value) return;
  await approveVisitRecord(selected.value.id);
  snackbarStore.showMessage('审核通过');
  dialog.value = false;
  loadData();
}

async function handleReject() {
  if (!selected.value) return;
  await rejectVisitRecord(selected.value.id, selected.value.appointment_id);
  snackbarStore.showMessage('已打回');
  dialog.value = false;
  loadData();
}

onMounted(loadData);
</script> 